<template>
    <div class="answer">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item label="学科：">
                <el-select v-model="formInline.region" placeholder="活动区域">
                    <el-option v-for="item,index in list1" :label="item.name" :value="item.name" @click.native="aaaa(item)"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="search">查询</el-button>
            </el-form-item>
        </el-form>
        <div style="width:99%">
            <el-table
                    v-loading="loading"
                    :data="list"
                    border>
                <el-table-column
                        prop="id"
                        label="学科"
                        width="130">
                </el-table-column>
                <el-table-column
                        prop="paperName"
                        label="试卷名称">
                </el-table-column>
                <el-table-column
                        prop="userName"
                        label="用户名称"
                        width="257">
                </el-table-column>
                <el-table-column
                        prop="userScore,paperScore"
                        label="得分"
                        width="180">
                    <template v-slot="scope">
                        {{ scope.row.userScore }} / {{ scope.row.paperScore }}
                    </template>
                </el-table-column>
                <el-table-column
                        prop="questionCorrect,questionCount"
                        label="题目对错"
                        width="180">
                    <template v-slot="scope">
                        {{ scope.row.questionCorrect }} / {{ scope.row.questionCount }}
                    </template>
                </el-table-column>
                <el-table-column
                        prop="doTime"
                        label="耗时"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="createTime"
                        label="提交时间"
                        width="180">
                </el-table-column>
            </el-table>
        </div>
        <div class="block" v-show="list?true:false" style="margin-top:20px;">
            <el-pagination
                    background
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage4"
                    :page-sizes="[5, 10, 30, 50]"
                    :page-size="100"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="list.length">
            </el-pagination>
        </div>
    </div>
</template>
<script>
    export default {
        data(){
            return {
                formInline:{
                    region:""
                },
                id:"",
                currentPage4: 4,
                list:[],
                list1:[],
                loading: false,
            }
        },
        mounted() {
            //获取列表信息
                this.axios({
                    url:"/api/admin/education/subject/list",
                    method:"post",
                }).then(res=>{
                    if(res.data.code==1){
                        this.list1 = res.data.response;
                    }
                })
            let obj = {
                "subjectId":null,  //学科
                "pageIndex": 1,
                "pageSize": 10
            }
            this.axios({
                url:"/api/admin/examPaperAnswer/page",
                method:"post",
                data:obj
            }).then(res=>{
                if(res.data.code==1){
                    this.list = res.data.response.list;
                }
            })
        },
        methods:{
            demo(obj){
                this.axios({
                    url:"/api/admin/education/subject/list",
                    method:"post",
                }).then(res=>{
                    console.log(res)
                    if(res.data.code==1){
                        this.list1 = res.data.response;
                    }
                })
                this.axios({
                    url:"/api/admin/examPaperAnswer/page",
                    method:"post",
                    data:obj
                }).then(res=>{
                    console.log(res)
                    if(res.data.code==1){
                        this.list = res.data.response.list;
                    }
                })
            },
            aaaa(item){
                this.region = item.level;
            },
            search(){
                let obj = {
                    "subjectId":this.region,  //学科
                    "pageIndex": 1,
                    "pageSize": 10
                }
                this.demo(obj);
                this.time();
            },
            handleSizeChange(val) {
                this.time();
            },
            time(){
                this.loading = true;
                setTimeout(()=>{
                    this.loading = false;
                },1000)
            },
            handleCurrentChange(val) {
                time();
                // console.log(`当前页: ${val}`);
            }
        }
    }
</script>
<style lang="scss" scoped>
    body {
        margin: 0;
    }
    .answer{
        padding:0 20px 20px 20px;
    }

</style>